import { defineStore } from 'pinia'
import type { Imenu } from 'types/menu'
import router from '@/router'
import type { RouteLocationNormalized } from 'vue-router'
import utils from '@/utils'
import { CacheEnum } from '@/enum/cacheEnum'

/**
 * 定义了一个Pinia,用来存储界面左侧菜单的展示信息及
 * 历史菜单中的内容
 */
export default defineStore('router', {
    state: () => ({ 
            menus: [] as Imenu[],
            historyMenu: [] as Imenu[],
        }),
    // getters: {
    //     doubleCount: (state) => state.count * 2,
    // },
    actions: {
      //根据路由获取菜单
      init(){
        this.getMenuByRoute()
        this.historyMenu = utils.store.get(CacheEnum.HISTORY_MENU) ?? []
      },

      /**
       * 添加历史路由，并判断pinia是否已存在该历史路由，若不存在将添加至数组首位
       * 如果已经超过10个历史路由，将数组末尾路由删除
       * 如果路由中不存在menu属性，则不添加
       * @param route 
       */
      addHistoryMenu(route:RouteLocationNormalized){
        if(!route.meta?.menu) return
          const menu:Imenu = {...route.meta?.menu, routeName: route.name as string}
          const isHas = this.historyMenu.some(menu=>menu.routeName == route.name)
          if(!isHas) this.historyMenu.unshift(menu)
          if(this.historyMenu.length > 10) this.historyMenu.pop()
          
          utils.store.set(CacheEnum.HISTORY_MENU,this.historyMenu)
      },
      /*
      *点击删除单条历史路由
      *同时重新设置浏览器缓存中的存储信息
      */
      removeHistoryMenu(menu:Imenu){
        const index = this.historyMenu.indexOf(menu)
        this.historyMenu.splice(index,1)
        utils.store.set(CacheEnum.HISTORY_MENU,this.historyMenu)
      },
      /**
       * 根据路由设置情况来设置左侧菜单的展示情况
       * 如果路由meta信息中设置了menu属性，表示该路由会被添加至菜单中
       * 子路由如果设置了menu属性，代表成为子菜单
       */
      getMenuByRoute() {
        this.menus = router
                 .getRoutes()
                 .filter(route => route.children.length && route.meta.menu)
                 .map(route =>{ 
                  let menu:Imenu = {...route.meta?.menu}
                  menu.children =  route.children
                  .filter(route => route.meta?.menu)
                  .map(route=>{
                    return {...route.meta?.menu, routeName:route.name}
                  }) as Imenu[]
                return menu
            })
            .filter(menu=>menu.children?.length)
       }
    },
    // 其他配置...
  })
